<template>
	<view class="content">
		<u-navbar :is-back="false" title="信息提交"></u-navbar>
		<u-form
			:model="formData"
			ref="uForm"
			label-position="top"
			:border-bottom="false"
		>
			<u-divider
				color="#18b566"
				margin-top="20"
				margin-bottom="0"
				border-color="#19be6b"
				>委托单位信息</u-divider
			>
			<u-form-item :border-bottom="false" label="单位名称" prop="weiName"
				><u-input
					v-model="formData.weiName"
					type="textarea"
					auto-height
					height="40"
          placeholder="请输入单位名称"
					border
			/></u-form-item>
			<u-form-item :border-bottom="false" label="联系人" prop="weiUser"
				><u-input
					v-model="formData.weiUser"
					type="textarea"
					auto-height
					height="40"
          placeholder="请输入联系人"
					border
			/></u-form-item>
			<u-form-item :border-bottom="false" label="电话" prop="weiPhone"
				><u-input
					v-model="formData.weiPhone"
					type="textarea"
					auto-height
					height="40"
          placeholder="请输入电话"
					border
			/></u-form-item>
			<u-form-item :border-bottom="false" label="单位地址" prop="weiAddress"
				><u-input
					v-model="formData.weiAddress"
					type="textarea"
					auto-height
					height="40"
          placeholder="请输入单位地址"
					border
			/></u-form-item>
			<u-form-item :border-bottom="false" label="邮编" prop="weiPostCode"
				><u-input
					v-model="formData.weiPostCode"
					type="textarea"
					auto-height
					height="40"
          placeholder="请输入邮编"
					border
			/></u-form-item>
			<u-form-item :border-bottom="false" label="传真" prop="weiTaxCode"
				><u-input
					v-model="formData.weiTaxCode"
					type="textarea"
					auto-height
					height="40"
          placeholder="请输入传真"
					border
			/></u-form-item>
			<u-divider
				color="#18b566"
				margin-top="20"
				margin-bottom="0"
				border-color="#19be6b"
				>受检单位信息</u-divider
			>
			<u-form-item :border-bottom="false" label="单位名称" prop="reciveName"
				><u-input
					v-model="formData.reciveName"
					type="textarea"
					auto-height
					height="40"
          placeholder="请输入单位名称"
					border
			/></u-form-item>
			<u-form-item :border-bottom="false" label="联系人" prop="reciveUser"
				><u-input
					v-model="formData.reciveUser"
					type="textarea"
					auto-height
					height="40"
          placeholder="请输入联系人"
					border
			/></u-form-item>
			<u-form-item :border-bottom="false" label="电话" prop="recivePhone"
				><u-input
					v-model="formData.recivePhone"
					type="textarea"
					auto-height
					height="40"
          placeholder="请输入电话"
					border
			/></u-form-item>
			<u-divider
				color="#18b566"
				margin-top="20"
				margin-bottom="0"
				border-color="#19be6b"
				>生产单位信息</u-divider
			>
			<u-form-item :border-bottom="false" label="单位名称" prop="productName"
				><u-input
					v-model="formData.productName"
					type="textarea"
					auto-height
					height="40"
          placeholder="请输入单位名称"
					border
			/></u-form-item>
			<u-form-item :border-bottom="false" label="联系人" prop="productUser"
				><u-input
					v-model="formData.productUser"
					type="textarea"
					auto-height
					height="40"
          placeholder="请输入联系人"
					border
			/></u-form-item>
			<u-form-item :border-bottom="false" label="电话" prop="productPhone"
				><u-input
					v-model="formData.productPhone"
					type="textarea"
					auto-height
					height="40"
          placeholder="请输入电话"
					border
			/></u-form-item>
			<u-form-item :border-bottom="false" label="单位地址" prop="productAddress"
				><u-input
					v-model="formData.productAddress"
					type="textarea"
					auto-height
					height="40"
          placeholder="请输入单位地址"
					border
			/></u-form-item>
			<u-form-item :border-bottom="false" label="邮编" prop="productPostCode"
				><u-input
					v-model="formData.productPostCode"
					type="textarea"
					auto-height
					height="40"
          placeholder="请输入邮编"
					border
			/></u-form-item>
			<u-form-item :border-bottom="false" label="传真" prop="productTaxCode"
				><u-input
					v-model="formData.productTaxCode"
					type="textarea"
					auto-height
					height="40"
          placeholder="请输入传真"
					border
			/></u-form-item>
      <u-divider
				color="#18b566"
				margin-top="20"
				margin-bottom="0"
				border-color="#19be6b"
				>检测项信息</u-divider
			>
      <u-form-item label="判定依据" prop="ceYiJu">
        <u-input 
          v-model="formData.ceYiJu" 
          placeholder="请输入判定依据" 
          type="textarea"
          :autosize="{ minRows: 1, maxRows: 6 }"
        ></u-input>
      </u-form-item>
      <u-form-item :border-bottom="false" label="检测项" prop="ceItems"
				>
        <u-checkbox-group @change="checkboxGroupChange">
    			<u-checkbox 
    				:checked="checkList.includes(item.id)"
    				v-for="(item, index) in checkList" :key="index" 
            v-model="item.checked"
    				:name="item.id"
    			>{{item.itemName}}</u-checkbox>
    		</u-checkbox-group>
      </u-form-item>
      <u-form-item label="其他项目或说明" prop="otherDesc" class="row-item">
        <u-input 
          v-model="formData.otherDesc" 
          placeholder="请输入其他项目或说明" 
          type="textarea"
          :autosize="{ minRows: 1, maxRows: 6 }"
        ></u-input>
      </u-form-item>
		</u-form>
    <view class="sign-box" @click='toSign' v-if='!noSign'>
        <view class="sign-tip" v-if='notSign' >用户签名区域</view>
        <view class="sign-img" v-else>
          <u-image :src='signSrc' height='320rpx' mode='scaleToFill'></u-image>
        </view>
      </view>
		<u-button type="success" @click="submit" :loading='onSub'>提交</u-button>
	</view>
</template>

<script>
import env from '@/env.js'
	export default {
		data() {
			return {
        checkList: [], // 检测项列表
        noSign: false,
        notSign: true,
        onSub: false,
				formData: {
          weiName: '',
          weiUser: '',
          weiPhone: '',
          weiAddress: '',
          weiPostCode: '',
          weiTaxCode: '',
          reciveName: '',
          reciveUser: '',
          recivePhone: '',
          productName: '',
          productUser: '',
          productPhone: '',
          productAddress: '',
          productPostCode: '',
          productTaxCode: '',
        },
				rules: {
          weiName: [{required: true, message: '请输入委托单位名称', trigger: 'blur'}],
          weiUser: [{required: true, message: '请输入委托单位联系人', trigger: 'blur'}],
          weiPhone: [{required: true, message: '请输入委托单位电话', trigger: 'blur'}],
          weiAddress: [{required: true, message: '请输入委托单位地址', trigger: 'blur'}],
          reciveName: [{required: true, message: '请输入受检单位名称', trigger: 'blur'}],
          reciveUser: [{required: true, message: '请输入受检单位联系人', trigger: 'blur'}],
          recivePhone: [{required: true, message: '请输入受检单位电话', trigger: 'blur'}],
          productName: [{required: true, message: '请输入生产单位名称', trigger: 'blur'}],
          productUser: [{required: true, message: '请输入生产单位联系人', trigger: 'blur'}],
          productPhone: [{required: true, message: '请输入生产单位电话', trigger: 'blur'}],
          productAddress: [{required: true, message: '请输入生产单位地址', trigger: 'blur'}],
          ceItems: [{required: true, message: '请选择检测项', trigger: 'blur'}],
        },
			};
		},
		onLoad(op) {
      this.getCheckList()
      if(op.fromSign) return this.loadPageData()
      if(op.noSign) this.noSign = true
    },
		onReady() {
			this.$refs.uForm.setRules(this.rules);
		},
		methods: {
      async getCheckList() {
        let maps = {
          dev: 'http://118.190.208.3:8888/',
          test: 'http://118.190.208.3:8888/',
          prod: 'http://106.116.245.184:8888/'
        }
        let service = maps[env]  
        this.$u.get(service + 'apis/checkItem/getPage', {current: 1,size:-1}).then(res => {
          if(res.code === 200) {
            this.checkList = res.data.list || []
          } else {
            this.$u.toast(res.msg)
          }
        })
      },

      checkboxGroupChange(e) {
        this.formData.ceItems = e.join(',')
      },

      toSign(val) {
        this.savePageData()
        this.$u.route({url: `pages/index/sign`, type: 'redirectTo'})
			},
      toJson(str, def) {
        try{
          return JSON.parse(str)
        }catch(e){
          return def
        }
      },

      savePageData() {      
        this.$u.GlobalData = this.$u.GlobalData || {}  
        this.$u.GlobalData.savePageData = this.$u.deepClone(this.formData)
        this.$u.GlobalData.fromRoute = `pages/index/index`
      },

      loadPageData() {
        let {signFile, savePageData} = this.$u.GlobalData || {}        
        if(signFile) {
          let file = this.toJson(signFile, {})
          this.signSrc = file?.data?.modelFile?.downPath
          this.notSign = false 	
          savePageData.applyName = this.signSrc
        }
        this.formData = savePageData || {}
      },

      // 提交
			submit() {
                this.onSub = true
                try{                    
                    let service = env == 'dev' ? 'http://118.190.208.3:8888/apis' : '/apis'        
                    this.$refs.uForm.validate((valid) => {
                      if(!valid) return this.onSub = true
                      this.$u.post(service + '/mainInfo/save', this.formData).then(res => {
                        if(res.code === 200) {
                          this.$u.toast('提交成功')
                          this.sendMessageToParent()
                          this.$u.route({ url: '/pages/success/index', type: 'redirectTo' })
                        } else {
                          this.$u.toast(res.msg)
                        }
                        this.onSub = false
                      })
                    })
                }catch(e) {
                    this.onSub = false
                }
        },
      
        sendMessageToParent() {
            const message = {
                close: 1
            };
      
            // 获取主窗口引用并发送消息
            window.top.postMessage(
              message, // 消息内容（支持对象、字符串等）
              'http://192.168.111.27:8999/'
              // "https://your-website.com" // 主窗口的源（需与实际主窗口域名一致）
            );
          }
		},
	};
</script >

<style lang='scss'>
	.content {
		padding: 20rpx 30rpx;
	}

  .sign-box{
      width: 100%;
      height: 300rpx;
      background: #cfcfcf;
      border-radius: 16rpx;
      margin: 20rpx auto;
      display: flex;
      .sign-tip{
        margin: auto;
      }
      .sign-img{
        width: 100%;
        height: 100%;
      }
    }
</style>
